<template lang="pug">
.registration-equipment
  .registration-equipment-header 
    .registration-equipment-header-left 
      mt-form(v-bind="formProps")
    .registration-equipment-header-right 
      mt-button(type="primary",@click="request('tableData')") 查询
  .registration-equipment-body 
    Table(
      v-bind="tableProps",ref="tableRef"
    )

</template>

<script setup lang="ts" name="equipment">
import {
  type FormItemProps,
  type FormProps,
  type IAction,
  type TableProps,
  useNotify,
  Table
} from "@scmt/common-components";
import { useRequest } from "@scmt/common-hooks";
import { type QueryPagination, useApi } from "@scmt/core-api";
import type {
  CheckEquipmentEntity,
  CheckEquipmentQueryParams,
} from "@scmt/api-pacs-check-equipment";
import { useUser } from "@scmt/common-store";

const user = useUser();
//定义传递equipmentId事件
const emit = defineEmits(["changEquipment"]);
const $api = useApi();
const $notify = useNotify();
//添加 Props属性
const props = defineProps({
  selectRegistration: Object,
});
const tableRef = ref<null | InstanceType<typeof Table>>(null);
const queryPramas = reactive<CheckEquipmentQueryParams>({
  name: "",
  pageNum: 1,
  pageSize: 20,
});
const editingObj = ref<null | CheckEquipmentEntity>(null);
const selectEquipment = defineModel();
const { request, data, loadingMap } = useRequest({
  tableData: (q: any) => {
    //回显登记单项目
    if (
      props.selectRegistration?.registrationProjectList &&
      props.selectRegistration?.registrationProjectList.length > 0
    ) {
      let projectId = props.selectRegistration?.registrationProjectList[0].id ? props.selectRegistration?.registrationProjectList[0].id : props.selectRegistration?.registrationProjectList[0].projectId;
      const params = Object.assign({ projectId: projectId }, queryPramas, q);
      return $api.pacs.checkEquipment.listWithProject(params);
    }
    else {
      const params = Object.assign({ officeId: user.currentOfficeId ?? "currentOfficeId" }, queryPramas, q);
      return $api.pacs.checkEquipment.query(params);
    }

  },
  save: (model: CheckEquipmentEntity) => {
    loadingMap.save = true;
    return $api.pacs.checkEquipment.save(model).then(() => {
      $notify.success("保存成功");
      editingObj.value = null;
      loadingMap.save = false;
      request("tableData", {
        pageSize: 20,
      });
    });
  },
  destroy: (ids: string) => {
    return $api.pacs.checkEquipment.destroy(ids).then(() => {
      $notify.success("删除成功");

      request("tableData", {
        pageSize: 20,
      });
    });
  },
});

onMounted(() => {
  request("tableData");
});
const formProps = computed<FormProps>(() => {
  const formItems: FormItemProps[] = [
    {
      prop: "deviceName",
      label: "",
      placeholder: "请输入设备名称",
    },

    {
      prop: "inspectionTypeId",
      label: "",
      placeholder: "请输入检查类型",
      as: "select",
      options: {
        loadMethod: () => $api.pacs.inspectionType.listAsOptions(),
      },
    },
  ];

  const editProps: FormProps = {
    model: queryPramas,
    items: formItems,
    columns: 2,
    labelWidth: "0px",
  };

  return editProps;
});
const currentRow = ref("");
const tableProps = computed(() => {
  const { tableData } = toRefs(data);
  currentRow.value = "";
  //默认选中
  if (tableData.value?.items?.length && tableData.value?.items?.length > 0) {
    if (tableRef && tableRef.value) {
      currentRow.value = tableData.value?.items[0].id;
      emit("changEquipment", "");
      nextTick(() => {
        emit("changEquipment", tableData.value?.items[0].id);
      })
    }

  }
  const tableProps: TableProps = {
    loading: loadingMap.tableData,
    data: tableData.value?.items,
    pagination: tableData.value?.pagination,
    columns: [
      {
        type: "index",
        label: "序号",
        width: "60px",
      },
      {
        prop: "deviceName",
        label: "设备名称",
        tooltip: true,
        minWidth: "120px",
      },

      {
        prop: "officeName",
        label: "科室名称",
        tooltip: true,
        minWidth: "120px",
      },
    ],
    onAct: onPageActions,
    onPaginate: (pagination: QueryPagination) =>
      request("tableData", pagination),
    onRowClick: (row: any) => {
      selectEquipment.value = row;
      emit("changEquipment", row.id);
    },
    layout: "total, prev, pager, next",
    highlightCurrentRow: true,
    currentRow: currentRow.value,
  };
  return tableProps;
});
const onPageActions = (action: IAction, model?: any) => {
  switch (action.event) {
    case "add":
    case "edit":
      editingObj.value = $api.pacs.checkEquipment.$$createEntity(model);
      break;
    case "destroy":
      request("destroy", model ? model.id : "");
      break;
  }
};
//监听登记单改变
watch(
  () => props.selectRegistration?.id,
  () => {
    //查询设备
    request("tableData", {});
  },
  {
    immediate: true,
  }
);


</script>

<style lang="less" scoped>
.registration-equipment {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding-top: var(--mt-padding);
  overflow: hidden;

  &-header {
    flex-shrink: 0;
    display: flex;

    &-right {
      flex-shrink: 0;
      margin-left: 5px;

      :deep(.mt-form-item) {
        .el-form-item {
          margin-top: 5px;
          margin-bottom: 5px;
        }

        margin-left: 0px;
      }
    }

    &-left {
      flex: 1;
    }
  }

  &-body {
    flex: 1;
  }
}
</style>
